import React from 'react';
import PropTypes from 'prop-types'

class TodoItem extends React.Component{

  constructor(props){
    super(props);
    this.handleClick = this.handleClick.bind(this);
    }

    shouldComponentUpdate(nextProps,nextState) {
      if(nextProps.content !== this.props.content){
        return true;
      }else{
        return false;
      }
    }

  render() {
    const {content, test} = this.props;
    return (
      <div
        onClick = {this.handleClick}
      >
        {content} - {test}
      </div>
    )
  }

  handleClick(){ 
    const {deleteItem, index} = this.props;
    deleteItem(index)
  }
}

TodoItem.propTypes = {
  //isRequired指必须要传递
  test: PropTypes.string.isRequired,
  content: PropTypes.string,
  deleteItem: PropTypes.func.isRequired,
  index: PropTypes.number
}

TodoItem.defaultProps = {
  test: 'by DirtyPool'
}

export default TodoItem;